/**
 * 公共组件 - 样式
 * @author xiaoxujs
 */

import styled from "styled-components";
import logo from '../../assets/image/Login/logo.png'
import NewLogo from '../../assets/image/Login/login_logo.png'

export const HomeBox = styled.div`
    background: #F7F9FB;
    .header-box{
        background: linear-gradient(267deg, #2F85F2 0%, #0151C3 100%);
        box-shadow: 0px 1px 13px 0px rgba(204,204,204,0.35);
        height: 6rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .menu-wai-box{
            width: 60rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .menu-box{
            background: none;
            color: #FFFFFF;
            height: 6rem;
            line-height: 6rem;
            font-size: 1.4rem;
            /* width: 80rem; */
            .ant-menu-title-content{
                height: 6rem;
                line-height: 6rem;
            }
            .ant-menu-item:hover::after{
                border-bottom-width: 0px;
                border-bottom-color: #3571EA;
            }
            .ant-menu-item-selected{
                background: #3571EA;
                border-bottom-color: #3571EA;
            }
            .ant-menu-item-active{
                border-bottom-color: #3571EA;
            }
            .ant-menu-item-active::after{
                border-bottom-color: #3571EA;
            }
            .ant-menu-item-selected::after {
                border-bottom-color: #2F85F2;
            }
        }
    }
    .demo-logo{
        /* width: 18.8rem; */
        height: 2.8rem;
        display: flex;
        align-items: center;
        .demo-logo-image{
            width: 4.8rem;
            height: 3.9rem;
            border-radius: 50%;
            /* background: url(${NewLogo}) ; */
            /* background-size: 100% 100%; */
            margin-right: 1rem;
        }
        .demo-logo-text{
            font-weight: normal;
            font-size: 2.4rem;
            color: #FFFFFF;
        }
        /* background: url(${logo});
        background-size: 100% 100%; */
    }
    .content-box{
        overflow-y: scroll;
        &::-webkit-scrollbar {
            display: none;
        }
        display: flex;
    }
    .name_box{
        display: flex;
        .iconfont {
            color: #FFFFFF;
            margin-right: 2rem;
        }
    }

`
export const ButtonBaise = styled.div`
    font-weight: 500;
    font-size: 1.6rem;
    color: #FFFFFF;
    cursor: pointer;
`
export const Hongdian = styled.span`
    margin-right: .4rem;
    color: #ff4d4f;
    font-size: 1.4rem;
    font-family: SimSun, sans-serif;
    line-height: 1;
`

export const TabsBox = styled.div`
display: flex;
    
`
export const TabsBoxYiji = styled.ul`
    height: 100% ;
    background: #F8FAFC;
    li{
        height: 7.8rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        width: 8rem;
        color: #818698;
        position: relative;
        cursor: pointer;
        font-family: Microsoft YaHei;
        font-weight: 400;
        font-size: 1.4rem;
        .iconfont_box{
            margin-bottom: 0.9rem;
            .iconfont {
                font-size: 2.4rem;
            }
        }
        .gun{
            width: .4rem;
            height: 1.4rem;
            background: #146EF5;
            border-radius: 2px;
            position: absolute;
            right: 0;
            top: 3.6rem;
        }
    }
    .xuanzhong{
        color: #146EF5 ;
    }
`
export const TabsBoxErji = styled.ul`
    height: 100%;
    width: 12.8rem;
    background-color: #FFFFFF;
    border: .1rem solid #F2F4FB;
    padding: 2rem 1rem;
    box-sizing: border-box;
    li{
        width: 100%;
        height: 3.6rem;
        color: #818698;
        border-radius: .4rem;
        display: flex;
        align-items: center;
        padding: 0 1rem;
        box-sizing: border-box;
        font-family: Microsoft YaHei;
        font-weight: 400;
        font-size: 1.4rem;
        cursor: pointer;
   
    }
    .xuanzhong{
        background: linear-gradient(-83deg, #EAF4FE 0%, #F1F6FB 100%);
        color: #146EF5;
    }
`